import React, { memo } from 'react';
import { Card } from 'antd';
import { Pie } from '@/components/Charts';

const SensLevel = memo(
  ({  loading, querySensLevelData }) => (
    <Card
      loading={loading}
      bordered={false}
      title="敏感信息等级分布"
      bodyStyle={{ padding: 12 }}
      style={{ marginBottom: 24 }}
    >
      <Pie
        hasLegend
        subTitle="敏感字段总数"
        data={querySensLevelData}
        total={() => <span>{querySensLevelData && querySensLevelData.reduce((pre, now) => Number(now.y) + Number(pre),0)}</span>}
        valueFormat={value => <span>{value} 个</span>}
        height={240}
        lineWidth={4}
        style={{ padding: '8px 0' }}
        colors={["#3fa1fd","#34caca","#f1627a","#fad341"]}
      />
    </Card>
  )
);
export default SensLevel;
